<template>
	<view class="app-container askquestion">
		<u-form :model="form">
			<u-form-item :required="true" label-width="160" label="选择实验:">
				<u-input v-model="experimentsName" border type="select" @click="selectShow = true" />
			</u-form-item>
			<u-form-item :required="true" label-width="180" label="问题标题:" label-position="top">
				<u-input placeholder="请输入问题标题"  v-model="form.title"border />
			</u-form-item>
			<u-form-item :required="true" label-width="180" label="问题内容:" label-position="top">
				<u-input placeholder="请输入问题内容" v-model="form.description" height="400"  type="textarea" border />
			</u-form-item>
			<u-form-item label-width="180"  label-position="top" label="附加图片:">
				<u-upload name="images" @on-remove="removeImage" :header="header" :action="action" :file-list="fileList" @on-success="uploadSuccess" ></u-upload>
			</u-form-item>
		</u-form>
		<view class="person-bottom">
			<u-button type="primary" @click="submitHandler">提交</u-button>
		</view>
		<u-select value-name="id" label-name="name" v-model="selectShow" :list="dataList" @confirm="selectComfirm"></u-select>
	</view>
</template>

<script>
	import * as that from '../../API/index.js'
	export default {
		data() {
			return {
				form:{
					description:'',
					title:'',
				},
				selectShow:false,
				list:[
					{
						label:'测试',
						value:1
					}
				],
				fileList:[],
				imageList:[],
				action: getApp().globalData.IP + '/server/Image/v1/api/upload/提问图片',
				header:{
					"X-Token": uni.getStorageSync('token') || '',
					"X-clientType": "Mini"
				},
				dataList:[],
				experimentsId:'',
				experimentsName:''
			};
		},
		mounted() {
			console.log(this.action)
			this.getExperiments()
		},
		methods:{
			uploadSuccess(e){
				console.log(e)
				if(e.code === 200){
					this.imageList.push(e.data[0].mainImg)
				}
			},
			removeImage(index){
				this.imageList.splice(index,1)
			},
			getExperiments() {
				that.experimentsList().then(res => {
					console.log(res)
					this.dataList = res.data
				})
			},
			selectComfirm(e){
				console.log(e)
				this.experimentsId = e[0].value
				this.experimentsName = e[0].label
			},
			submitHandler(){
				if(!this.experimentsName){
					uni.showToast({
						title:'请选择实验'
					})
					return
				}
				if(!this.form.title){
					uni.showToast({
						title:'请输入标题'
					})
					return
				}
				if(!this.form.description){
					uni.showToast({
						title:'请输入问题内容'
					})
					return
				}
				that.insertQuestion(this.experimentsId,{
					title:this.form.title,
					description:this.form.description,
					images:this.imageList.join(',')
				}).then(res =>{
					uni.showToast({
						title:'提交成功！'
					})
					setTimeout(()=>{
						uni.navigateBack()
					},2000)
				})
			}
		}
	}
</script>

<style lang="scss">
.askquestion{
	padding: 0 40rpx;
}
</style>
